<template>
  <el-dialog
    title="审核改善点"
    :visible.sync="dialogVisible"
    :modal="true"
    :appendToBody="true"
    width="50%"
    v-dialog-drag
    :close-on-click-modal="false"
    top="3vh"
    class="report-text-form"
    @close="handleClose()"
    @open="handleOpen()"
  >
    <el-form :model="form" :rules="rules" ref="ruleForm" label-width="110px">
      <el-form-item label="所属工厂">
        <div class="text-value">{{taskDetail.factoryDeptName}}</div>
      </el-form-item>
      <el-form-item label="所属车间">
        <div class="text-value">{{taskDetail.workshopName}}</div>
      </el-form-item>
      <el-form-item label="所属产线">
        <div class="text-value">{{taskDetail.lineName}}</div>
      </el-form-item>
      <el-form-item label="改善点名称">
        <div class="text-value">{{taskDetail.reportTaskName}}</div>
      </el-form-item>

      <el-form-item label="改善点内容">
        <div class="text-value">{{taskDetail.reportTaskDes}}</div>
      </el-form-item>

      <el-form-item label="附件">
        <template v-if='taskDetail.files && taskDetail.files.length'>
          <div class="text-value" v-for="item in taskDetail.files" :key='item.id'>
            <el-link type="primary" :underline="false" @click="preview(item)">{{item.fileName}}</el-link>
          </div>
        </template>
        <div v-else>-</div>
      </el-form-item>

      <el-form-item label="上报时间" class="report-date">
        <div class="text-value">{{taskDetail.reportDate}}</div>
      </el-form-item>
      <el-divider></el-divider>
      <el-form-item label="审核结果" prop="checkResult">
        <el-radio-group v-model="form.checkResult">
          <el-radio :label="1">同意</el-radio>
          <el-radio :label="0">驳回</el-radio>
        </el-radio-group>
      </el-form-item>

      <el-form-item label="审核意见" prop="checkDes">
        <el-input
          type="textarea"
          :autosize="{ minRows: 2}"
          maxlength="200"
          show-word-limit
          placeholder="请输入审核意见"
          v-model="form.checkDes">
        </el-input>
      </el-form-item>
    </el-form>

    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" :loading="saveloading" @click="handleSubmit">确 定</el-button>
    </span>
  </el-dialog>
</template>
<script>
  import axios from 'axios'
  import { getToken } from '@/utils/auth'
  import { downloadFile } from '@/utils/file'
  import { parseTime } from '@/utils/eam'
  import service from "../../../utils/request";
  import { GEN_SERVER } from '@/config/baseUrl'
  import {reportDetail,reportPass,reportReject,downLoad} from "@/api/leanTask/report";
export default {
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    row: {
      type: Object,
      default: ()=>{}
    }
  },
  data() {
    return {
      form: {
        id:null,
        checkResult:null,
        checkDes:null,
      },

      rules: {
        checkResult: [
          { required: true, message: "请选择审核结果", trigger: "change" },
        ],
      },
      taskDetail:{},
      saveloading: false
    };
  },
  computed: {
    dialogVisible: {
      set(val) {
        this.$emit("update:visible", val)
      },
      get() {
        return this.visible
      }
    }
  },
  methods: {
    handleClose() {
      this.saveloading = false
      this.resetFormData()
    },

    handleOpen() {
      this.resetFormData();
      this.getReportDetail();
      this.form.id = this.row.id;
    },

    getReportDetail(){
      reportDetail(this.row.id)
      .then(res=>{
        if (res.code == 200 && res.data) {
          this.taskDetail = res.data;
        } else {
          this.taskDetail = {};
          this.resetFormData()
        }
      }).catch(() => {
        this.resetFormData()
      })
    },

    handleSubmit() {
      this.saveloading = true
      this.$refs.ruleForm
      .validate((flag) => {
        if (flag) {
          const parmas = {
            id:this.form.id,
            checkDes:this.form.checkDes
          }
          if(this.form.checkResult == 1){//通过
            this.reportPass(parmas)
          }else{
            this.reportReject(parmas)
          }
        } else {
          this.saveloading = false
        }
      })
    },

    reportPass(parmas){
      reportPass(parmas).then(res => {
        if (res.code == 200) {
          this.msgSuccess("操作成功")
          this.$emit("submit-success")
          this.dialogVisible = false
        } else {
          this.msgError(res.msg || "操作失败")
        }
        this.saveloading = false
      }).catch(() => {
        this.msgError("操作失败")
        this.saveloading = false
      })
    },

    reportReject(parmas){
      reportReject(parmas).then(res => {
        if (res.code == 200) {
          this.msgSuccess("操作成功")
          this.$emit("submit-success")
          this.dialogVisible = false
        } else {
          this.msgError(res.msg || "操作失败")
        }
        this.saveloading = false
      }).catch(() => {
        this.msgError("操作失败")
        this.saveloading = false
      })
    },

    preview(item){
      axios({
        baseURL:service.baseURL + GEN_SERVER['form-server'],
        url:'/refine/report/byte/down',
        method:"get",
        params:{id:item.id},
        headers: {Authorization:'Bearer ' + getToken()},
        responseType: 'blob'
      }).then(res => {
        let count = item.fileName.lastIndexOf(".");
        let fileName = item.fileName.slice(0,count);
        let suffix = item.fileName.slice(count);
        downloadFile(res.data,`${fileName}${parseTime(new Date(), '{y}{m}{d}')}${suffix}`)
        this.saveloading = false
      }).catch(() => {
        this.msgError("操作失败")
        this.saveloading = false
      })
    },

    resetFormData() {
      this.$refs.ruleForm?.resetFields()
      this.form = {
        checkResult:null,
        checkDes:null,
      };
    },
  }
};
</script>
<style lang="scss" scoped>
.el-form {
  .el-date-editor.el-input,
  .el-select {
    width: 100%;
  }
}
.tool-bar{
  margin-bottom:20px
}
.text-value{
  font-size: 0.875rem;
  line-height:2.25rem;
  color:#666
}
.report-text-form{
  ::v-deep .el-dialog .el-dialog__body{
    max-height: calc(100vh - 16rem);
  }
  .el-divider--horizontal{
    margin:16px 0
  }
  .report-date{
    margin-bottom:0;
  }
}

</style>
